<!DOCTYPE html>
<html>
	<head>
		<meta charset="utf-8" />
		<meta name="viewport" content="width=device-width,user-scalable=no, initial-scale=1">
		<title>CRM</title>
		<link rel="stylesheet" type="text/css" href="../static/azxcrm/css/wap/aui.css" th:href="@{/azxcrm/css/wap/aui.css}" />
		<link rel="stylesheet" type="text/css" href="../static/azxcrm/css/wap/aui.css" th:href="@{/azxcrm/css/wap/order_infor_documentaty.css}" />
		<link rel="stylesheet" type="text/css" href="//at.alicdn.com/t/font_835360_8flqp9ignrc.css"/>
        <script src="/azxcrm/js/wap/api.js" th:src="@{/azxcrm/js/wap/api.js}" type="text/javascript" charset="utf-8"></script>
        <script src="/azxcrm/js/wap/aui-tab.js" th:src="@{/azxcrm/js/wap/aui-tab.js}" type="text/javascript" charset="utf-8"></script>
        <script src="../static/azxcrm/js/wap/jquery-3.3.1.min.js" type="text/javascript" th:src="@{/azxcrm/js/wap/jquery-3.3.1.min.js}"
    charset="utf-8"></script>
	</head>
	<body>
		<header class="aui-bar aui-bar-nav">
			 <a th:href="@{/indexWap(status=${status})}"  class="aui-pull-left aui-btn" th:if="${status == 0}">
	       		 <span class="iconfont icon-fanhui1">返回</span>
	    	</a>
	    	<a th:href="@{/wap/order/followOrder(status=${status})}"  class="aui-pull-left aui-btn" th:if="${status == 1}">
                 <span class="iconfont icon-fanhui1">返回</span>
            </a>
		    <div class="aui-title">订单详情</div>
		</header>
		<div class="aui-content aui-time">剩于保有时间：<span th:text="${protectDay}"></span>天</div>
		
		<div class="aui-tab aui-border-b" id="tab">
            <div class="aui-tab-item aui-active" tapmode="" data-item-order="0">基本信息</div>
            <div class="aui-tab-item" tapmode="" data-item-order="1">跟单记录</div>
        </div>
        <div class="aui-padded-5 " id="tab1-con">
            	<!--基本信息-->
	        <div id="tab1-con1">
				<section class="aui-grid aui-margin-b-15">
					<div class="aui-content aui-margin-b-15 g-box1">
					    <ul class="aui-list aui-list-in">			       
					        <li class="aui-list-item">
					            <div class="aui-list-item-inner">
					            	<div class="clearfix">
					            		<div class="aui-list-item-title">订单编号：</div>	
					                	<div class="aui-text"><span th:text="${order.orderNum}"></span></div>
					            	</div>			                
					            </div>
					        </li>
					        <li class="aui-list-item">
					            <div class="aui-list-item-inner">
					            	<div class="clearfix">
						                <div class="aui-list-item-title">订单类型：</div>
						                <div class="aui-text"><span th:text="${order.typeName}"></span></div>
						            </div>    
					            </div>
					        </li>			       
					    </ul>
					</div>
						
					<div class="aui-content aui-margin-b-15 g-box1">
					    <ul class="aui-list aui-list-in">
					        <li class="aui-list-header">
					        	<h3><img src="../azxcrm/image/wap/customer.png">客户信息</h3>
					        	
					        	<a class="xgzl" th:href="@{/wap/customer/editCustomer(clueId=${order.customerClue.clueId},orderId=${order.orderId},status=${status})}">修改资料</a>
					        </li>
					        <li class="aui-list-item">
					            <div class="aui-list-item-inner">
					            	<div class="clearfix">
					            		<div class="aui-list-item-title">客户姓名：</div>	
					                	<div class="aui-text"><span th:text="${order.customerClue.customerName}"></span></div>
					            	</div>			                
					            </div>
					        </li>
					        <li class="aui-list-item">
					            <div class="aui-list-item-inner">
					            	<div class="clearfix">
						                <div class="aui-list-item-title">客户性别：</div>
						                <div class="aui-text">
						                <span th:if="${order.customerClue.customerSex} == 1">男</span>
						                <span th:if="${order.customerClue.customerSex} == 2">女</span>
						                </div>
						            </div>    
					            </div>
					        </li>	
					         <li class="aui-list-item">
					            <div class="aui-list-item-inner">
					            	<div class="clearfix">
						                <div class="aui-list-item-title">客户年龄：</div>
						                <div class="aui-text"><span th:text="${order.customerClue.customerAge}"></span></div>
						            </div>    
					            </div>
					        </li>	
					         <li class="aui-list-item">
					            <div class="aui-list-item-inner">
					            	<div class="aui-list-item-inner">
						                <div class="aui-list-item-title">所在地：</div>
						                <div class="aui-text aui-jy"><span th:text="${order.customerClue.customerProvince}+'-'+${order.customerClue.customerCity}+'-'+${order.customerClue.customerArea}+'-'+${order.customerClue.customerAddressDetail}"></span></div>
						            </div>    
					            </div>
					        </li>
					    </ul>
					</div>
					
					<div class="aui-content aui-margin-b-15 g-box1">
					    <ul class="aui-list aui-list-in">
					        <li class="aui-list-header">
					        	<h3><img src="../azxcrm/image/wap/rzsq.png">入住诉求</h3>
					        </li>
					        <li class="aui-list-item">
					            <div class="aui-list-item-inner">
					            	<div class="clearfix">
					            		<div class="aui-list-item-title">入住类型：</div>	
					                	<div class="aui-text">
					                	<span th:if="${order.customerClue.occupancyType} == 0">非本类型线索</span>
					                	<span th:if="${order.customerClue.occupancyType} == 1">长住</span>
					                	<span th:if="${order.customerClue.occupancyType} == 2">短住</span>
					                    </div>
					            	</div>			                
					            </div>
					        </li>			        
					    </ul>
					</div>
					<div class="aui-content aui-margin-b-15 g-box1">
					    <ul class="aui-list aui-list-in" th:each="customerAttendance:${customerAttendanceList}">
					        <li class="aui-list-header">
					        	<h3><img src="../azxcrm/image/wap/ckxx.png">参课信息</h3>
					        </li>
					        <li class="aui-list-item">
					            <div class="aui-list-item-inner">
					            	<div class="clearfix">
					            		<div class="aui-list-item-title">参课时间：</div>	
					                	<div class="aui-text"><span th:text="${customerAttendance.attendanceTime}"></span></div>
					            	</div>			                
					            </div>
					        </li>
					        <li class="aui-list-item">
					            <div class="aui-list-item-inner">
					            	<div class="clearfix">
					            		<div class="aui-list-item-title">业务员：</div>	
					                	<div class="aui-text"><span th:text="${order.salesUserName}"></span></div>
					            	</div>			                
					            </div>
					        </li>	
					    </ul>
					</div>
					
					<div class="aui-content aui-margin-b-15 g-box1">
					    <ul class="aui-list aui-list-in">
					        <li class="aui-list-header">
					        	<h3><img src="../azxcrm/image/wap/custormer_information.png">客服信息</h3>
					        </li>
					        <li class="aui-list-item">
					            <div class="aui-list-item-inner">
					            	<div class="clearfix">
					            		<div class="aui-list-item-title">专属客服：</div>	
					                	<div class="aui-text"><span th:text="${order.serviceUserName}"></span></div>
					            	</div>			                
					            </div>
					        </li>	
					        <li class="aui-list-item telphone">
					            <div class="aui-list-item-inner">
					            	<div class="clearfix">
					            		<div class="aui-list-item-title">联系电话：</div>	
					                	<div class="aui-text"><span th:text="${user.phonenumber}"></span></div>
					            	</div>			                
					            </div>
					        </li>	
					    </ul>
					</div>
					
					<div class="aui-content aui-margin-b-15 g-box1">
					    <ul class="aui-list aui-list-in">			       
					        <li class="aui-list-item">
					            <div class="aui-list-item-inner">			            	
				            		<div class="aui-list-item-title" style="text-align: right;">客服建议：</div>	
				                	<div class="aui-text aui-jy"><span th:text="${clueCommunication.suggestion}"></span></div>			            			                
					            </div>
					        </li>	
					    </ul>
					</div>
				</section>			
			</div>
	        <!--跟单记录-->
	        
	        <div class="aui-hide" id="tab1-con2">
				<section class="aui-grid aui-margin-b-15">
					<div class="aui-content aui-margin-b-15"  th:each="orderVisitRecord : ${orderVisitRecords}">
					    <ul class="aui-list aui-list-in">  
					    <a th:href="@{/wap/wapOrderFollowRecordDetails(recordId=${orderVisitRecord.recordId})}">     
					        <li class="aui-list-item">
					            <div class="aui-list-item-inner">
					            	<div class="clearfix g-div">
					            		<div class="aui-list-item-title phone_visit" th:text="${order.salesUserName}+':电话拜访了客户'"></div>	
					                	<div class="aui-label aui-label-info">
						                	<span class="customer-hf" th:if="${orderVisitRecord.visitStatus} == 0" style="background:red;padding:0.1rem">客户未回访</span>
						                	<span class="customer-hf" th:if="${orderVisitRecord.visitStatus} == 1" style="background:#67b4f5;padding:0.1rem">客户已回访</span>
					                	</div>
					            	</div>			                
					            </div>
					        </li>
	
					        <li class="aui-list-item">
					            <div class="aui-list-item-inner" style="color: #666666;padding: 0.3rem 0 0.3rem 0;">	
					            	<div class="clearfix g-div">
					            		<div class="aui-list-item-title" style="width:24%;text-align: right;">拜访内容：</div>	
					                	<div class="aui-text aui-jy"><span class="s-data-content" th:text="${orderVisitRecord.visitRecord}"></span></div>	
				                	</div>
					            </div>
					        </li>
					        <li class="aui-list-item">
					            <div class="aui-list-item-inner" style="color: #666666;padding: 0.3rem 0 0.3rem 0;">	
					               	<div class="clearfix g-div">	            	
					            		<div class="aui-list-item-title" style="width:24%;text-align: right;">备注：</div>	
					                	<div class="aui-text aui-jy"><span class="s-data-content" th:text="${orderVisitRecord.visitRemark}"></span></div>			            			                
					                </div>
					            </div>
					        </li>
					        <li class="aui-list-item">
					            <div class="aui-list-item-inner">
					            	<div class="clearfix g-div">
					            		<div class="aui-list-item-title s-time"><span class="s-data-content" th:text="${orderVisitRecord.visitTime}"></span></div>	
					            	</div>			                
					            </div>
					        </li>
					         </a>       
					    </ul>
					</div>
				</section>	
	        </div>
       
           </div>
           <footer class="aui-bar aui-bar-tab" id="footer">
		    <a th:href="@{/wap/wapOrderFollowAdd(orderId=${order.orderId},status=${status})}" class="aui-bar-tab-item btn">                   
		        <div class="aui-bar-tab-label g-text">添加跟单记录</div>
		    </a>  
		    <a th:href="@{/wap/wapOrderPerfect(orderId=${order.orderId},status=${status})}" class="aui-bar-tab-item">                   
		        <div class="aui-bar-tab-label g-text">发起结单</div>
		    </a> 
	   </footer>
	</body>
</html>
<script type="text/javascript">
        apiready = function(){api.parseTapmode();}
        var tab = new auiTab({
            element: document.getElementById("tab"),

        }, function(ret) {
            if (ret) {
                //定义获取对象的所有兄弟节点的函数，
                function siblings(elm) {
                    var a = [];
                    var p = elm.parentNode.children;
                    for (var i = 0, pl = p.length; i < pl; i++) {
                        if (p[i] !== elm) a.push(p[i]);
                    }
                    return a;
                }
               
                var index = ret.index;
                var activeC = document.getElementById("tab1-con" + index);
                activeC.className = "";
                for (var i = 0; i < siblings(activeC).length; i++) {
                    siblings(activeC)[i].className = "aui-hide";
                }
            }
        });
        
        sessionStorage.setItem("order",0);
    </script>